<template>
    <van-nav-bar title="注册豆瓣" />

    <p style="font-size: 12px;">新手机号将自动注册，请详读 <span style="color: green;">豆瓣使用协议、豆瓣个人信息保护政策</span></p>

    <van-form @submit="onSubmit">
        <van-cell-group inset>
            <van-field v-model="username" name="username" label="用户名" placeholder="用户名"
                :rules="[{ required: true, message: '请填写用户名' }]" />
            <van-field v-model="password" type="password" name="password" label="密码" placeholder="密码"
                :rules="[{ required: true, message: '请填写密码' }]" />
        </van-cell-group>
        <div style="margin: 16px;">
            <van-button round block type="primary" native-type="submit">
                注册
            </van-button>
        </div>
    </van-form>

    <div class="icon">
        <p>第三方登录</p>
        <span><van-icon name="wechat" /></span> <span><van-icon name="weibo" /></span>
    </div>
</template>

<script setup>
import { ref } from "vue";
const username = ref('');
const password = ref('');
import { showDialog } from 'vant';
import { useRouter } from 'vue-router'
const router = useRouter();
const onSubmit = ({ username, password }) => {
    if (username === 'admin' && password === '123456') {
        const token = localStorage.getItem("token",)

        showDialog({
            title: '登录提示',
            message: '登录成功',
            theme: 'round-button',
        }).then(() => {
            // on close
        });
        router.push('/home')
    } else {
        showDialog({
            title: '登录提示',
            message: '登录失败',
            theme: 'round-button',
        }).then(() => {
            // on close
        });
    }
}
</script>

<style lang="scss" scoped>
.icon {
    text-align: center;
    margin-top: 300px;
}
</style>